<div class="d-flex align-items-center justify-content-center">
  <div class="row w-100 mx-0 auth-page">
    <div class="col-md-5 col-sm-8 col-xl-3 mx-auto pe-5 ps-5">
      <div class="w-360">
        <div class="row">
          <div class="col-md-12">
            <div class="py-5">
              <div class="text-center">
                <img alt="Worklenz" height="50" src="/assets/images/logo.png">
              </div>

              <nz-result
                *ngIf="informationSent"
                nzStatus="success"
                nzTitle="Reset instruction sent!"
                nzSubTitle="Reset information has been sent to your email. Please check your email."
              >
              </nz-result>

              <div *ngIf="!informationSent">
                <div class="text-muted mb-4 mt-1 text-center">
                  Please enter your email address. You will receive a link to create a new password via email.
                </div>
                <div aria-labelledby="auth-tab-content">
                  <form (submit)="resetPassword()" [formGroup]="form" class="login-form" nz-form>
                    <nz-form-item>
                      <nz-form-control nzErrorTip="Please enter your email!">
                        <nz-input-group nzPrefixIcon="user" nzSize="large">
                          <input #emailInput [formControlName]="'email'" nz-input placeholder="Enter your email"
                                 type="email"/>
                        </nz-input-group>
                      </nz-form-control>
                    </nz-form-item>
                    <button [nzLoading]="loading" [nzType]="'primary'" class="mt-1" nz-button nzBlock nzSize="large">
                      Reset Password
                    </button>
                    <div class="text-center mt-2">
                      OR
                    </div>
                    <button [routerLink]="['/auth/login']" [nzType]="'default'" class="mt-1" nz-button
                            nzBlock nzSize="large" type="button">
                      Return to Login
                    </button>
                  </form>
                </div>
              </div>

            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

</div>
